.notify {
  @apply w-full p-5 bg-white flex;
  height: 88px;
  font-family: PingFang SC;
  box-shadow: 3px 22px 50px -2px rgba(121, 120, 130, 0.15);
  .notifyMain {
    @apply flex flex-1 h-full rounded pr-5 pl-10 flex items-center justify-between;
    background: #f0ffe1;
    &.redNotify {
      background: #fff0ed;
      .read {
        @apply bg-red;
      }
    }
    .textBox {
      @apply flex flex-1 items-center;
      img {
        @apply h-4 w-4;
        margin-right: 10px;
      }
      span {
        @apply text-main text-base opacity-90;
      }
    }
    .read {
      @apply block h-6 text-center leading-6 text-sm text-white cursor-pointer;
      width: 56px;
      border-radius: 24px;
      background: #26a615;
      &:hover {
        @apply bg-main;
      }
    }
  }
  .switchInfo {
    @apply rounded flex items-center justify-center;
    width: 90px;
    height: 48px;
    background: #eeeeee;
    border: 1px solid #c8c8c8;
    margin-left: 10px;
    .leftSwitch {
      @apply cursor-pointer;
      transform: rotate(90deg);
    }
    span {
      @apply font-semibold text-xs text-main;
    }
    .rightSwitch {
      @apply cursor-pointer;
      transform: rotate(-90deg);
    }
    .disableSwitch {
      @apply cursor-not-allowed;
      path {
        fill: #c8c8c8;
      }
    }
  }
}
